<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>保单服务</title>
<link href="../statics/css/bootstrap.min.css" rel="stylesheet" media="screen">

<style type="text/css">
	body{
	background: rgb(238,238,238);
	}
	.headera{
		    height: 2.2em;
		    line-height: 2.2em;
		    background: #fd3f63;
		    text-align: center;
		    color: #fff;
		    font-size: 1.7em;
		  
	}
	.headerb{
		 	background: white;
	}
	.innera{
			height: 2.8em;
			line-height: 2.8em;	
			text-align: center;
			color: black;
			font-size: 1.40em;
			margin-bottom: 0.2em;
		 	border-bottom: 2px solid red;
		 	margin: 0px;
	}
	.innerb{
			height: 2.8em;
			 line-height: 2.8em;	
			text-align: center;
			color: black;
		 	font-size: 1.40em;
		 	border-bottom: 2px solid white;
	}
	.innerc{
	   		 float: right;
   			 color: #d6d6d6;
   			 font-size: .38rem;
			height: 2.8em;
			 line-height: 2.8em;	
			text-align: center;
		 	font-size: 1.60em;
		 	position: relative;
		 	top: -1.8rem;
		 	left: 0.4em;
	}
	.headerc{
		width: 100%;
		height: 100%;
		padding-top: 1.7em;
		background: rgb(238,238,238);
	}
	.inputaa{
		width: 50%;
	}
	.nameaa{
		width: 18em;
		border-style:none;
	}
	.tablea{
		background:white;
		font-size: 1.00em;
		margin-bottom: 0px;
	}
	.tableb{
		background:white;
		font-size: 1.00em;
		margin-top:0px;
		margin-bottom: 0px;
	}
	
	.tablea td{
		height: 3.0em;
		line-height: 3.0em;	
	}
	.tablea tr:last-child{
		border-bottom: 1px solid gainsboro ;
	}
	.rowbb{
		display:none;
	}
	.colad{
		height: 100%;
		line-height: 3.0em;	
		background:rgb(238,238,238);
		padding: 1.6em;
	}
	.colae{
	height: 100%;
		line-height: 3.0em;	
		background:rgb(238,238,238);
		padding: 1.6em;
	}
	.submitaa{
		
		background:rgb(253,63,96);
		border-style:none;
		border-radius: 0.5em;
		width: 22em;
		height: 3em;
		color:white;
	}
	.submitab{
	background:rgb(253,63,96);
		border-style:none;
		border-radius: 0.5em;
		width: 22em;
		height: 3em;
		color:white;
	}
	.hrLine{
			color:red;
		 vertical-align:middle; 
		 display:inline-block;
	}
	.spanaa{
		background:rgb(238,238,238);
		color: red;
		padding-top: 1.5em;
		padding-bottom: 2em;
	}
	.hh:first-child{
		margin-top: 2em;
	}
	.hh{
		color:black;
		line-height:1.5em;
	}
	
</style>
</head>
<body>

	<div class="row">
		<div class="col-xs-12 headerab"></div>
		<div class="col-xs-12 headera">保单及理赔查询</div>
		<div class="col-xs-12 headerb">
			
			<div class="col-xs-6 innera">身份信息查询<i class="innerc"></i></div>
			
			<div class="col-xs-6 innerb">保单号查询</div>
			
		</div>
	</div>
	<!--调空隙 无意义  -->
	<div class="row"><div class="col-xs-12 headerc"></div></div>
	
	<!--用于提交 的第一个表单  -->
	<div class="row rowaa">
		<div  class="col-xs-12">
				<!-- <input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock">
				<input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock">
				<input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock"> -->
				<form action="renewal">
					<table class="table tablea">
  							<tr>
							  <td >名&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称</td>
							  <td><input type="text" class="nameaa" name="insuredname" placeholder="投保人/被保人姓名或企业事业单位名称"/></td>
							</tr>
							<tr>
							  <td>证件号码</td>
							  <td ><input type="text" class="nameaa" name="identity" placeholder="请输入18位身份证"/></td>
							</tr>
					</table>
					<div class="col-xs-12 colad">
						<input class="submitaa"	type="submit" value="提交"/>
						
					</div>
				</form>
		</div>
	</div>
	
	
	
	<!--用于提交 的第二个表单  -->
	<div class="row rowbb">
		<div  class="col-xs-12">
				<!-- <input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock">
				<input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock">
				<input type="text" id="inputHelpBlock" class="form-control inputaa" aria-describedby="helpBlock"> -->
				<form action="renewalbyno">
					<table class="table tableb">
						<tr>
							  <td >保单号</td>
							   <td ><input type="text" class="nameaa" name="policyno"  placeholder="请输入保单号"/></td>
							</tr>
  							<tr>
							  <td >名&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称</td>
							   <td ><input type="text" class="nameaa" name="insuredname" placeholder="投保人/被保人姓名或企业事业单位名称"/></td>
							</tr>
							<tr>
							  <td >证件号码</td>
							   <td ><input type="text" class="nameaa" name="identity" placeholder="请输入18位身份证"/></td>
							</tr>
							
					</table>
							<div class="col-xs-12 colae">
								<input class="submitab"	type="submit" value="提交"/>
							</div>
				</form>
		</div>
	</div>
		<div class="col-xs-12 spanaa">
						 温馨提示
						 <h6 class=".h6 hh">1、如为共保业务，请到主承包公司进行查询。</h6>
						 <h6 class=".h6 hh">2、团单业务已开放，如需查询团单的理赔信息请前往官网或拨打"95556"咨询。</h6>
						 <h6 class=".h6 hh">3、信用保证保险业务，请到公众号或官网查询。</h6>
						 <h6 class=".h6 hh">4、非车险电子发票功能已开通，通过官网、微商城等，华安平台承保的保单，可开具电子发票。</h6>
						</div>
						
	
</body>
<script type="text/javascript" src="../statics/js/jquery-1.12.4.js" ></script>
<script type="text/javascript">
	$(function(){
		$(".innera").click(function(){
			$(".innera").css("border-bottom","2px solid red");
			$(".innerb").css("border-bottom","2px solid white");
				$(".rowaa").show();
			$(".rowbb").hide();
		});
		$(".innerb").click(function(){
			$(".innera").css("border-bottom","2px solid white");
			$(".innerb").css("border-bottom","2px solid red");
				$(".rowbb").show();
			$(".rowaa").hide();
		});
	});
	
</script>
</html>